<template>
	<layout>
		<view class="content">
			<div class="links">
				<view v-if="this.roles.includes('student')" class="link" @click="go('/pages/mine/help/index')">
					<image class="link-icon" src="@/static/jiaofeichaxun3x.png"></image>
					<view class="text-area">
						<text class="title">缴费查询</text>
					</view>
				</view>
				<view v-if="this.roles.includes('student')" class="link" @click="go('/pages/leave/leave/index')">
					<image class="link-icon" src="@/static/qingjiashenqing.png"></image>
					<view class="text-area">
						<text class="title">请假申请</text>
					</view>
				</view>
				<view v-if="this.roles.includes('student')" class="link" @click="go('/pages/leave/leaveRecord/index')">
					<image class="link-icon" src="@/static/qingjiashenpiliucheng.png"></image>
					<view class="text-area">
						<text class="title">请假记录</text>
					</view>
				</view>
				<view v-if="this.roles.includes('student')" class="link" @click="go('/pages/mine/punchClock/index')">
					<image class="link-icon" src="@/static/daka.png"></image>
					<view class="text-area">
						<text class="title">打卡</text>
					</view>
				</view>
				<view v-if="this.roles.includes('student')" class="link" @click="go('/pages/repair/reportRepair/index')">
					<image class="link-icon" src="@/static/baoshibaoxiu.png"></image>
					<view class="text-area">
						<text class="title">报修申请</text>
					</view>
				</view>
				<view v-if="this.roles.includes('student')" class="link" @click="go('/pages/repair/reportRepairList/index')">
					<image class="link-icon" src="@/static/reportRepairList.png"></image>
					<view class="text-area">
						<text class="title">报修记录</text>
					</view>
				</view>
				<!-- <view class="link" @click="go('/pages/reissueCard/reissueCard/index')">
					<image class="link-icon" src="@/static/bukashenqing.png"></image>
					<view class="text-area">
						<text class="title">补卡申请</text>
					</view>
				</view>
				<view class="link" @click="go('/pages/reissueCard/reissueCardRecord/index')">
					<image class="link-icon" src="@/static/bukashenqingjilv.png"></image>
					<view class="text-area">
						<text class="title">补卡记录</text>
					</view>
				</view> -->

				<!-- 签到 临时开放入口 -->
			<!-- 	<view class="link" @click="goSignIn(`/pages/signIn/index?id=${signRuleId}`)">
					<image class="link-icon" src="@/static/qiandao.png"></image>
					<view class="text-area">
						<text class="title">签到</text>
					</view>
				</view> -->

				<!-- 工人入口 start -->
				<view v-if="this.roles.includes('logistics') || this.roles.includes('hqzr')" class="link" @click="go('/pages/repair/workerReportRepairList/index')">
					<image class="link-icon" src="@/static/myreportRepairList.png"></image>
					<view class="text-area">
						<text class="title">我的检修</text>
					</view>
				</view>
				<!-- 工人入口 end -->

				<!-- 管理员入口 start -->
				<view v-if="this.roles.includes('instructor')" class="link" @click="go('/pages/mine/checkBedroom/index')">
					<image class="link-icon" src="@/static/checkBedroom.png"></image>
					<view class="text-area">
						<text class="title">查寝</text>
					</view>
				</view>
				<!-- 管理员入口 end -->
				
				<view v-if="this.roles.includes('student')" class="link" @click="go('/pages/mine/info/index')">
					<image class="link-icon" src="@/static/wodedangan.png"></image>
					<view class="text-area">
						<text class="title">我的档案</text>
					</view>
				</view>
				<view class="link" @click="go('/pages/mine/pwd/index')">
					<image class="link-icon" src="@/static/xiugaimima.png"></image>
					<view class="text-area">
						<text class="title">修改密码</text>
					</view>
				</view>
				<view class="link" @click="logout">
					<image class="link-icon" src="@/static/logout.png"></image>
					<view class="text-area">
						<text class="title">退出登录</text>
					</view>
				</view>
			</div>
		</view>
	</layout>
</template>

<script>
	import {
		getSecret
	} from '../api/login';
	import layout from './common/layout/layout.vue';
	export default {
		components: {
			layout
		},
		data() {
			return {
				signRuleId: '',
				user: {},
				roles: []
			}
		},
		onLoad(options) {
			const {
				business_scene,
				business_id
			} = options;
			if (business_scene && business_id) {
				if (business_scene == 'student_attend') {
					this.signRuleId = business_id;
					this.go(`/pages/signIn/index?id=${business_id}&type=${business_scene}`)
				}
			}
		},
		mounted() {},
		created() {
			getSecret().then(data => {
				uni.setStorageSync('secret', data.secret);
				this.getUersInfo();
			})
		},
		methods: {
			goTab(url) {
				this.$tab.reLaunch(url)
			},
			go(url) {
				this.$tab.navigateTo(url)
			},
			goSignIn(url) {
				if (this.signRuleId) {
					this.$tab.navigateTo(url)
				} else {
					uni.showToast({
						icon: 'error',
						title: '不存在规则id，请扫码进入'
					})
				}
			},
			getUersInfo() {
				this.$store.dispatch('GetInfo').then(res => {
					this.user = res.user;
					this.roles = res.user.roles.map(c => c.roleKey);
				})
			},
			logout() {
				this.$store.dispatch('LogOut').then(res => {
					uni.reLaunch({
						url: '/pages/login'
					})
				})
			}
		}
	}
</script>

<style lang="scss">
	.content {
		background-color: #fff;
		padding-left: 30rpx;
		padding-right: 30rpx;
		padding-top: 50rpx;
		height: 100vh;

		.links {
			overflow: hidden;
			display: grid;
			grid-template-columns: repeat(4, 1fr);
			grid-gap: 10rpx;
			padding: 10rpx;

			.link {
				display: flex;
				flex-direction: column;
				align-items: flex-start;
				justify-content: center;
				align-items: center;
				font-size: 12rpx;
				margin-bottom: 30rpx;

				.link-icon {
					width: 120rpx;
					height: 120rpx;
					margin-bottom: 20rpx;
				}
			}
		}
	}

	.logo {
		height: 200rpx;
		width: 200rpx;
		margin-top: 200rpx;
		margin-left: auto;
		margin-right: auto;
		margin-bottom: 50rpx;
	}

	.text-area {
		display: flex;
		justify-content: center;
	}

	.title {
		font-size: 24rpx;
		color: #000;
	}
</style>